<template>
    <div class="accounting">
        <img
            class="ssfgk-bj"
            src="https://xzcs-video.oss-cn-beijing.aliyuncs.com/seo_m/m_ssfgk_bj.png"
            alt="税收法规库"
        />
        <div class="nav-bar" :style="{ top: AppNavShow ? '3.5rem' : 0 }">
            <nuxt-link to="/" class="left">
                <van-icon name="arrow-left" color="#000000" size="1.5rem" />
            </nuxt-link>
            <div class="centent">税收法规库</div>
            <div class="right"></div>
        </div>
        <div class="search">
            <div class="select" @click="showPicker = true">
                {{ retrieveFields == "title" ? "查标题" : "" }}
                {{ retrieveFields == "info_content_text" ? "查文章" : "" }}
                {{ retrieveFields == "push_number" ? "查文号" : "" }}
                {{ retrieveFields == "push_date" ? "查时间" : "" }}
                <van-icon
                    name="play"
                    size="0.8rem"
                    color="#333333"
                    class="select-icon"
                />
            </div>
            <div class="line"></div>
            <div class="input">
                <van-search
                    v-if="retrieveFields != 'push_date'"
                    v-model="inputText"
                    placeholder="请输入搜索关键词"
                    @search="onSearch"
                />
                <div v-else class="input-date">
                    <div @click="showDatePopup(1)">{{ date1 }}</div>
                    <span>至</span>
                    <div @click="showDatePopup(2)">{{ date2 }}</div>
                </div>
            </div>
            <van-icon
                name="search"
                size="1.5rem"
                color="#333333"
                class="search-icon"
                @click="onSearch"
            />
        </div>
        <div
            class="tabs"
            :style="{
                top: AppNavShow ? '6.25rem' : '3.5rem',
            }"
        >
            <van-tabs
                v-model="tabsIndex"
                title-active-color="#333333"
                background="transparent"
                color="#4291FF"
                line-width="1.25rem"
                class="vantabs"
            >
                <van-tab
                    v-for="(item, index) in tabsList"
                    :title="item.name"
                    :key="index"
                    :to="`/ssfgk/${item.pathName}/0/1`"
                >
                </van-tab>
            </van-tabs>
            <div class="line"></div>
            <div class="more" @click="showTabs = true">
                <van-icon
                    name="arrow-down"
                    color="#ffffff"
                    size="14"
                    class="icon"
                />
            </div>
        </div>
        <div
            class="data-list"
            :style="{
                height: `calc(100vh - 3.9rem - ${
                    AppNavShow ? '6.25rem' : '3.5rem'
                } - 44px )`,
            }"
        >
            <nuxt-link
                v-for="(item, index) in dataList"
                :key="index"
                class="data-item"
                :to="`/ssfgk/${item.id}.html`"
            >
                <div class="title">{{ item.title }}</div>
                <div class="tags">
                    <div class="tag">效力注释：{{ item.active_info }}</div>
                    <div class="tag">发文日期：{{ item.push_date }}</div>
                </div>
            </nuxt-link>
            <div class="page">
                <van-pagination
                    v-model="page"
                    :total-items="total"
                    :show-page-size="3"
                    :items-per-page="pageSize"
                    force-ellipses
                    @change="changePage"
                />
            </div>
        </div>

        <van-popup v-model="showPicker" round position="bottom">
            <van-picker
                show-toolbar
                :columns="columns"
                @cancel="showPicker = false"
                @confirm="onConfirm"
            />
        </van-popup>
        <van-popup v-model="showDate" round position="bottom">
            <van-datetime-picker
                v-model="currentDate"
                type="date"
                title="选择年月日"
                :min-date="minDate"
                :max-date="maxDate"
                @confirm="dateConfirm"
            />
        </van-popup>

        <van-popup v-model="showTabs" round position="top">
            <div class="tab-list">
                <nuxtLink
                    v-for="(item, index) in tabsList"
                    :key="index"
                    class="tab-item"
                    :class="{'tab-item-active': index == tabsIndex}"
                    :to="`/ssfgk/${item.pathName}/0/1`"
                >
                    {{ item.name }}
                </nuxtLink>
            </div>
        </van-popup>
    </div>
</template>

<script>
import { mapMutations, mapState } from "vuex";
import { customs } from "@/assets/utils/regulation.js";
import {
    faguislideshow,
    getPolicyGetList,
    getPolicyCate,
    getPolicyPcCate,
} from "@/assets/api/regulationsApi.js";
import {
    newXungetSearch,
    checkview,
    getanalysedata,
} from "@/assets/api/indexApi.js";
import { recommend_policy } from "@/assets/api/quizData";

import {
    goTopSmooth,
    hightLightText,
    getArr_objKey,
    getText,
    downLoadAPP,
} from "@/assets/utils/utils.js";

import moment from "moment";
import { Toast } from "vant";
export default {
    async asyncData({ params, query, store }) {
        let data = {
            tabsList: [
                {
                    name: "热点法规",
                    fieldName: "is_hot",
                    pathName: "index",
                    value: 1,
                    code: "PD1",
                },
                {
                    name: "中央税收法规",
                    fieldName: "city_code",
                    pathName: "zyfg",
                    value: 1,
                    class: [],
                    searchFilter: {
                        code: "1",
                    },
                    code: "PD3",
                },
                // {
                //     name: "税收优惠政策",
                //     fieldName: "type",
                //     pathName: "yhzz",
                //     value: 1,
                //     noShow: true,
                //     class: [],
                //     searchFilter: {
                //         type: "1",
                //     },
                //     code: "PD4",
                // },
                {
                    name: "地方税收政策",
                    fieldName: "city_code",
                    pathName: "dfff",
                    value: -1,
                    class: [
                        {
                            name: "全部",
                            id: -1,
                        },
                    ],
                    searchFilter: {
                        code: "-1",
                    },
                    code: "PD5",
                },
                {
                    name: "海关综合文件",
                    fieldName: "policy_cate_id",
                    pathName: "hgzhwj",
                    value: 27,
                    class: [
                        {
                            name: "海关综合文件",
                        },
                    ],
                    searchFilter: {
                        policy_cate_id: "27",
                    },
                    code: "PD6",
                },
                {
                    name: "国际跨境税收",
                    fieldName: "policy_cate_id",
                    pathName: "gjkjss",
                    value: 20,
                    class: [
                        {
                            name: "国际跨境税收",
                        },
                    ],
                    searchFilter: {
                        policy_cate_id: "20",
                    },
                    code: "PD7",
                },
                {
                    name: "外汇文件",
                    fieldName: "policy_cate_id",
                    pathName: "whwj",
                    value: 28,
                    class: [
                        {
                            name: "外汇文件",
                        },
                    ],
                    searchFilter: {
                        policy_cate_id: "28",
                    },
                    code: "PD8",
                },
                {
                    name: "12366热点回答",
                    fieldName: "policy_cate_id",
                    pathName: "12366rdwd",
                    value: 32,
                    class: [
                        {
                            name: "12366热点回答",
                        },
                    ],
                    searchFilter: {
                        policy_cate_id: "32",
                    },
                    code: "PD9",
                },
                // {
                //     name: "政府补助",
                //     fieldName: "policy_cate_id",
                //     pathName: "zfbz",
                //     value: 30,
                //     class: [
                //         {
                //             name: "政府补助",
                //         },
                //     ],
                //     searchFilter: {
                //         policy_cate_id: "30",
                //     },
                //     code: "PD10",
                // },
                {
                    name: "法规法条",
                    fieldName: "is_fatiao",
                    pathName: "fgft",
                    value: 1,
                    class: [
                        {
                            name: "法规法条",
                        },
                    ],
                    searchFilter: {
                        is_fatiao: "1",
                    },
                    code: "PD11",
                },
            ],
            isSearch: false,
            total: 0,
            pageSize: 10,
            page: 1,
            tabsIndex: 0,
            tabsTwoIndex: 0,
            dataList: [],
            jsonld: {
                "@context": "https://ziyuan.baidu.com/contexts/cambrian.jsonld",
                "@id": "https://www.xzcs2022.com/ssfgk/",
                images: [""],
                title: "",
                description: "",
                pubDate: "",
                upDate: "",
            },
        };

        if (params.page) data.page = parseInt(params.page.replace(".html", ""));
        if (params.type) {
            data.tabsIndex = getArr_objKey(
                data.tabsList,
                params.type,
                "pathName"
            );
        }
        data.jsonld[
            "@id"
        ] += `${params.type}/${params.indexTwo}/${params.page}`;

        let parems2 = {
            page: data.page,
            limit: data.pageSize,
            type: 2,
        };
        parems2[data.tabsList[data.tabsIndex].fieldName] =
            data.tabsList[data.tabsIndex].value;

        if (data.tabsIndex == 1) {
            parems2.place = 1;
            parems2.policy_cate_id = "";
        }
        // if (data.tabsIndex == 2) {
        //     parems2.policy_cate_id = "";
        //     parems2.type = 1;
        // }
        if (data.tabsIndex == 2) {
            parems2.place = 1;
            parems2.city_code = -1;
        }
        const res2 = await getPolicyGetList(parems2);

        if (res2.code == 1) {
            data.dataList = res2.data;
            if (res2.data.length > 0) {
                data.total = res2.data[0].all_count;
                data.jsonld.pubDate = data.jsonld.upDate = moment(
                    res2.data[0].createtime * 1000
                ).format("YYYY-MM-DD");
            } else this.total = 0;
        }

        return data;
    },

    head() {
        return {
            script: [
                {
                    type: "application/ld+json",
                    innerHTML: JSON.stringify(this.jsonld), // <- set jsonld object in data or wherever you want
                },
            ],
            __dangerouslyDisableSanitizers: ["script"],
            title: this.metaTitle + "-【小竹财税平台】",
            meta: [
                {
                    hid: "description",
                    name: "description",
                    content: this.metaDescription,
                },
                {
                    hid: "keywords",
                    name: "keywords",
                    content: this.metaKeywords,
                },
            ],
        };
    },
    layout: "home",
    components: {},
    data() {
        return {
            metaTitle: "小竹税收法规库",
            metaKeywords: "小竹税收法规库,财税法规库,税收法规库",
            metaDescription:
                "小竹税收法规库汇集了各种税收政策和地方税收法规，包括但不限于增值税、企业所得税、个人所得税、印花税、土地增值及相关的税收解读说明和操作指南。",

            getText: getText,

            // tabsIndex: 0,
            // tabsTwoIndex: 0,

            linkList: [
                {
                    name: "税局",
                },
                {
                    name: "海关",
                },
            ],
            linkIndex: 0,

            // 税种
            policyCate: [],
            // 效力注释
            xiaoliList: [
                {
                    id: "现行有效",
                    name: "现行有效",
                },
                {
                    id: "部分失效/废止",
                    name: "部分失效/废止",
                },
                {
                    id: "全文失效/废止",
                    name: "全文失效/废止",
                },
                {
                    id: "已修订",
                    name: "已修订",
                },
            ],

            swiper: [],

            // 法规数据列表
            // dataList: [],
            // total: 0,
            // pageSize: 30,
            // page: 1,

            // 高级搜索显示
            highSearchShow: false,
            // 搜索2
            searchInput: "",
            number2: "",
            number3: "",
            date: "",

            retrieveFields: "title",

            // 搜索
            isSenior: true, // 高级搜索  4.27 默认高级搜索
            title_keyword: "", // 标题关键字
            cons_keyword: "", // 内容关键字
            zh_keyword1: "", // 文号
            zh_keyword2: "", // 文号
            zh_keyword3: "", // 文号
            city_code: "", // 地区
            policy_cate_id: "", //  企业所得税
            xiaoli_id: "", // 效力注释
            date_: "",

            pickerOptions: {
                shortcuts: [
                    {
                        text: "一个月内",
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(
                                start.getTime() - 3600 * 1000 * 24 * 30
                            );
                            picker.$emit("pick", [start, end]);
                        },
                    },
                    {
                        text: "三个月内",
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(
                                start.getTime() - 3600 * 1000 * 24 * 90
                            );
                            picker.$emit("pick", [start, end]);
                        },
                    },
                    {
                        text: "一年内",
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(
                                start.getTime() - 3600 * 1000 * 24 * 365
                            );
                            picker.$emit("pick", [start, end]);
                        },
                    },
                ],
            },

            region: [],

            loading: false,
            isSearch: false,

            downLoadAPP: downLoadAPP,
            showTabs: false,

            showPicker: false,
            columns: [
                { text: "查标题", name: "title" },
                { text: "查文章", name: "info_content_text" },
                { text: "查文号", name: "push_number" },
                { text: "查时间", name: "push_date" },
            ],
            retrieveFields: "title",
            date1: "",
            date2: "",
            dateIndex: 1,
            showDate: false,
            minDate: new Date(1970, 0, 1),
            maxDate: new Date(),
            currentDate: new Date(),
            inputText: "",
        };
    },
    computed: {
        ...mapState("regulations", {}),
        ...mapState("common", {
            userInfo: (state) => state.userInfo,
            AppNavShow: (state) => state.AppNavShow,
        }),
    },
    created() {
        this.getMetaInfo();

        this.jsonld.title = this.metaTitle + "-【小竹财税平台】";
        this.jsonld.description = this.metaDescription;
    },
    mounted() {
        console.log(this.dataList);
        for (let item of this.tabsList) {
            if (item.pathName == this.$route.params.type) {
                let m_id = 2;
                getanalysedata({
                    m_id: m_id,
                    type: 1,
                    code: item.code,
                    describe: item.name,
                });
            }
        }

        this.$nextTick(() => {
            goTopSmooth();
        });
    },
    watch: {},
    methods: {
        getMetaInfo() {
            if (this.$route.params.type == "index") {
                this.metaTitle = "小竹税收法规库-财税法规库";
                this.metaKeywords = "小竹税收法规库,小竹财税法规库";
                this.metaDescription =
                    "小竹税收法规库汇集了各种税收政策和地方财税法规，包括但不限于增值税、企业所得税、个人所得税、印花税和土地增值税及相关的税收解读说明和操作指南。";
            } else if (this.$route.params.type == "zyfg") {
                this.metaTitle = "中央税收法规-税收法规库";
                this.metaKeywords = "中央税收法规";
                this.metaDescription =
                    "小竹财税中央税收法规版块，汇集众多中央税收法规政策。实时更新中央颁布的税收条例及税收相关规定，帮助企业及从业人员深入了解税收法规，并积极响应最新税收政策的宣传与发布。";
            } else if (this.$route.params.type == "yhzz") {
                this.metaTitle = "税收优惠政策-税收法规库";
                this.metaKeywords = "税收优惠政策";
                this.metaDescription =
                    "小竹财税税收优惠政策版块，汇集众多税收优惠政策。实时更新税收优惠政策条例及税收相关优惠规定出台，并积极响应税收优惠政策的发布与实施。";
            } else if (this.$route.params.type == "dfff") {
                this.metaTitle = "地方税收法规-税收法规库";
                this.metaKeywords = "地方税收法规";
                this.metaDescription =
                    "小竹财税地方税收法规版块，汇集众多税地方税收法规政策，实时更新地方税收法规条例及相关地方税收法规优惠政策出台，并积极推动地方税收法规宣传与发布。";
            } else if (this.$route.params.type == "hgzhwj") {
                this.metaTitle = "海关综合文件税收法规-税收法规库";
                this.metaKeywords = "海关综合文件税收法规";
                this.metaDescription =
                    "小竹财税海关综合文件税收法规版块，汇集众多海关综合文件税收法规，实时更海关综合文件税收法规条例及相关海关综合文件税收法规政策出台，并积极推动海关综合文件税收法规宣传与发布。";
            } else if (this.$route.params.type == "gjkjss") {
                this.metaTitle = "国际跨境税收法规-税收法规库";
                this.metaKeywords = "国际跨境税收法规";
                this.metaDescription =
                    "小竹财税国际跨境税收法规版块，汇集众多国际跨境税收法规。实时更新国际跨境税收条例及相关的国际跨境税收政策出台，并积极推动国际跨境税收政策宣传与发布。";
            } else if (this.$route.params.type == "whwj") {
                this.metaTitle = "外汇文件税收法规-税收法规库";
                this.metaKeywords = "外汇文件税收法规";
                this.metaDescription =
                    "小竹财税外汇文件税收法规板块，汇集众多外汇文件税收法规。实时更新外汇文件税收法规条例及相关的外汇文件税收法规政策出台，并积极推动外汇文件税收法规宣传与发布。";
            } else if (this.$route.params.type == "12366rdwd") {
                this.metaTitle = "12366税收热点问答-税收法规库";
                this.metaKeywords = "12366税收热点问答";
                this.metaDescription =
                    "小竹财税12366税收热点问答版块，汇集众多12366税收热点问答。实时更新12366税收热点问答及相关的12366税收热点问答政策出台，并积极推动外汇文件税收法规宣传与发布。";
            } else if (this.$route.params.type == "zfbz") {
                this.metaTitle = "政府补助税收法规-税收法规库";
                this.metaKeywords = "政府补助税收法规";
                this.metaDescription =
                    "小竹财税政府补助税收法规版块，汇集众多政府补助税收法规。实时更新政府补助税收法规及相关政府补助税收法规政策出台，并积极推动政府补助税收法规宣传与发布。";
            } else if (this.$route.params.type == "fgft") {
                this.metaTitle = "税收法规法条-税收法规库";
                this.metaKeywords = "税收法规法条";
                this.metaDescription =
                    "小竹财税税收法规法条版块，汇集众多多税收法规法条。实时更新税收法规法条及相关税收法规法条政策出台，并积极推动税收法规法条宣传与发布。";
            }
        },

        // 切换分页
        changePage(page) {
            this.page = page;
            this.$router.push({
                name: "ssfgk-type-indexTwo-page",
                query: {},
                params: {
                    type: this.$route.params.type,
                    page: page + "",
                    indexTwo: 0,
                },
            });
        },

        onConfirm(item, index) {
            this.retrieveFields = item.name;
            this.showPicker = false;
        },
        showDatePopup(index) {
            this.dateIndex = index;
            this.showDate = true;
        },
        dateConfirm(date) {
            let year = date.getFullYear(); // 获取年份（四位数）
            let month = ("0" + (date.getMonth() + 1)).slice(-2); // 获取月份（注意月份是从0开始的，所以需要+1），并确保是两位数
            let day = ("0" + date.getDate()).slice(-2);
            let formattedDate = year + "-" + month + "-" + day;
            this["date" + this.dateIndex] = formattedDate;
            this.showDate = false;
        },

        onSearch() {
            let url = "/ssfgksearch?";
            if (
                this.retrieveFields == "title" ||
                this.retrieveFields == "info_content_text" ||
                this.retrieveFields == "push_number"
            ) {
                if (!this.inputText) {
                    Toast("请输入搜索内容");
                    return;
                }
                url += `k=${this.inputText}&date=&t=${this.retrieveFields}`;
            }
            if (this.retrieveFields == "push_date") {
                if (!this.date1 || !this.date2) {
                    Toast("请选择时间范围");
                    return;
                }
                url += `k=&date=${this.date1},${this.date2}&t=${this.retrieveFields}`;
            }
            this.$router.push({
                path: url,
            });
        },
    },
};
</script>

<style lang="scss" scoped>
.accounting {
    position: relative;
    background-color: #ffffff;
}
.ssfgk-bj {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    z-index: 1;
}
.nav-bar {
    width: 100%;
    position: sticky;

    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1rem;
    height: 2.75rem;
    .left,
    .right {
        width: 15%;
    }

    .centent {
        font-weight: 600;
        font-size: 1.31rem;
        color: #333333;
    }
}

.search {
    position: relative;
    z-index: 100;
    width: 91%;
    height: 2.5rem;
    margin: 0.7rem auto;
    background-color: #ffffff;
    border-radius: 2.5rem;
    display: flex;
    align-items: center;
    padding: 0 1rem 0 1.2rem;
    .select {
        font-size: 0.75rem;
        color: #333333;
        .select-icon {
            transform: rotate(90deg);
            position: relative;
            top: -0.07rem;
        }
    }
    .line {
        width: 1px;
        height: 1.125rem;
        background-color: #bbbbbb;
        margin: 0 0.68rem;
    }
    .input {
        width: 63%;
    }
    .search-icon {
        position: absolute;
        right: 1rem;
    }

    .input-date {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        font-size: 0.75rem;
        div {
            width: 100%;
            text-align: center;
            height: 1.2rem;
            line-height: 1.2rem;
        }
        span {
            color: #999999;
        }
    }

    ::v-deep .van-cell {
        padding: 0;
    }
    ::v-deep .van-search {
        padding: 0;
    }
    ::v-deep .van-search__content {
        background: transparent;
    }
    ::v-deep .van-field__left-icon {
        display: none;
    }
}

.tabs {
    position: sticky;
    z-index: 110;
    display: flex;
    align-items: center;
    // justify-content: space-between;
    box-sizing: border-box;
    .line {
        width: 0.6rem;
    }
    .vantabs {
        width: 88.5vw;
    }
    .more {
        border-radius: 5rem;
        width: 1.3rem;
        height: 1.3rem;
        min-width: 1.3rem;
        text-align: center;
        line-height: 1.3rem;
        background-color: #999999;
    }
}

.tab-list{
    .tab-item{
        text-align: center;
        padding: 0.8rem;
        border-top: 1px solid #DCDFE6;
        color: #333333;
        font-size: 0.8rem;
        display: block;
    }
    .tab-item-active{
        color: #409EFF;
    }
}

.data-list {
    position: relative;
    z-index: 100;
    width: 92%;
    background: #ffffff;
    border-radius: 10px;
    padding: 0 0.93rem;
    margin: 00.5rem auto 0;
    overflow: auto;
}

.data-item {
    border-bottom: 1px solid #e5e5e5;
    padding: 1rem 0;
    display: block;
    .title {
        font-weight: 500;
        font-size: 0.93rem;
        line-height: 1.5;
        color: #3d3d3d;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
    }
    .tags {
        margin-top: 0.63rem;
        display: flex;
        align-items: center;

        .tag {
            margin-right: 0.6rem;
            color: #999999;
            font-size: 0.75rem;
        }
    }
}

.page {
    width: 92%;
    margin: 0 auto;
    padding: 1rem 0;
}
</style>